<style>
    *, :after, :before{
        box-sizing: border-box;
    }
    html,body{
        margin:0;
        padding: 0;
    }
    body{
        font-family: monospace,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Helvetica,PingFang SC,Hiragino Sans GB,Microsoft YaHei,SimSun,sans-serif;
        background: url('./public/images/bg.png');
    }
    .form{
        width: 460px;
        height: 340px;
        position: absolute;
        top:50%;
        left: 50%;
        margin-top:-140px;
        margin-left:-230px;
        background: #fff;
        box-shadow: 2px solid rgba(0,0,0,0.5);
        border-radius: 5px;
    }
    .form .title{
        font-weight:normal;
        color: #32a1ff;
        text-align: center;
        font-size: 34px;
        position: absolute;
        top: -80px;
        width: 100%;
        line-height: 40px;
    }
    .form .form-wrap{
        margin-top: 60px;
    }
    .form .form-item{
        width: 320px;
        margin: 0 auto;
        margin-top: 40px;
    }
    .form .form-item input{
        width: 100%;
        border:none;
        border-bottom: 1px solid #eee;
        height: 40px;
        color: #333;
        font-size: 14px;
        font-weight: normal;
        outline: none;
        letter-spacing: 2px;
    }
    .form .form-item .button{
        width: 100%;
        height: 50px;
        line-height: 50px;
        background: #32a1ff;
        color: #fff;
        text-align: center;
        font-size: 20px;
        border: none;
        border-radius: 2px;
        /*margin-top: 20px;*/
        cursor: pointer;
    }
</style>

<div class="form">
    <h1 class="title">法制教育考试系统登录</h1>
    <form method="post" action="/login" class="form-wrap">
        <input type="hidden" name="_id" value={{_id}} />
        <input type="hidden" name="url" value={{url}} />
        <div class="form-item">
            <input type="user_name" placeholder="姓名" value="" id="user_name" name="user_name" class="ant-input ant-input-lg"  autocomplete="off"/>
        </div>
        <div class="form-item">
            <input type="user_idcard" placeholder="身份证" value="" id="user_idcard" name="user_idcard" class="ant-input ant-input-lg" autocomplete="off" />
        </div>
        <div class="form-item">
            <button type="button" id="loginBtn" class="button"><span>登 录</span></button>
        </div>
    </form>

    <p style="color: #f04134;text-align: center;">{{error}}</p>
</div>



<script type="text/javascript">
(function(){
    document.getElementById('loginBtn').onclick = function(e){
        e.preventDefault();
        var tar = e.target || e.srcElement;
        tar.setAttribute('disabled','disabled');
        tar.innerText = '登录中...';
        document.forms[0].submit();
    }
})();
</script>